<template>
	<view :class="config.style">
		<FullscreenLoading :loading="loading" :config="config"></FullscreenLoading>
		<!-- #ifdef H5-->
		<Top :config="config"></Top>
		<!-- #endif -->
		<view class="main-section top">
			<view class="base-info" @click="goToContent(data.id)">
				<view class="cover">
					<image :src="data.cover_200" mode="widthFix"></image>
				</view>
				<view class="info">
					<view class="title">
						{{data.name}}
					</view>
					<view class="description text-ellipsis-2">
						{{data.description}}
					</view>
				</view>
			</view>
			
			<view class="list-section" v-if="loading == false">
				<view v-if="data.knowledge_count > 0">
					<KnowledgeList title="课程列表组件" type="knowledge_list" :params="knowledgeListParams" :config="config" />
				</view>
				<view v-if="data.column_count > 0">
					<ColumnList title="专栏列表组件" type="column_list" :params="columnListParams" :config="config" />
				</view>
				<view v-if="data.livecourse_count >0">
					<LiveList title="直播课堂列表组件" type="live_list" :params="liveListParams" :config="config" />
				</view>
				<view v-if="data.offline_count > 0">
					<OfflineList title="线下课列表组件" type="offline_list" :params="offlineListParams" :config="config" />
				</view>
				<view v-if="data.material_count > 0">
					<MaterialList title="资料下载列表组件" type="material_list" :params="materialListParams" :config="config" />
				</view>
				<template v-if="config">
					<CopyRight :config="config" />
				</template>
			</view>
			
		</view>
	</view>
</template>

<script>
	import { mapState,mapMutations } from 'vuex'
	//全屏加载中
	import FullscreenLoading from '../../../components/muu-fullscreen-loading/muu-fullscreen-loading.vue'
	import ColumnList from '../../diys/ColumnList/ColumnList.vue' //专栏列表组件
	import KnowledgeList from '../../diys/KnowledgeList/KnowledgeList.vue' //课程列表组件
	import LiveList from '../../diys/LiveList/LiveList.vue' //直播课堂列表组件
	import MaterialList from '../../diys/MaterialList/MaterialList.vue' //资料下载列表组件
	import OfflineList from '../../diys/OfflineList/OfflineList.vue' //线下课列表组件
	import CopyRight from '../common/copyRight.vue' //自定义版权
	import Top from '../common/top.vue'
	
	export default {
		
		components: {
			FullscreenLoading,
			ColumnList,
			KnowledgeList,
			LiveList,
			MaterialList,
			OfflineList,
			CopyRight,
			Top
		},
		data() {
			return {
				loading: true, //加载中
				urlParams: {},
				data: {}, //教师数据
				knowledgeListParams: {}, //点播课列表
				columnListParams: {}, //专栏列表
				liveListParams: {}, //直播列表
				offlineListParams: {}, //线下课列表
				materialListParams: {}, //资料列表
			}
		},
		onReady() {
			console.log('onReady')
			
		},
		onLoad(option) { //option为object类型，会序列化上个页面传递的参数
		    //console.log(option); //打印出上个页面传递的参数。
			this.urlParams = option
			//通过小程序码进入的获取参数
			if(option.scene){
				// options 中的 scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
				let scene = decodeURIComponent(option.scene); 
				let obj = {};
				for (var i = 0; i < scene.split('*').length;i++){
				  var arr = scene.split('*')[i].split('/');
				  obj[arr[0]] = arr[1];
				}
			
				this.urlParams.id = obj.id
				this.urlParams.promoter_uid = obj.u
				//console.log(this.urlParams,'scene')
			}
			
			if(this.urlParams.promoter_uid){
				uni.setStorageSync('promoter_uid',this.urlParams.promoter_uid)
			}
			
			Promise.all([
				this.getData(),
				this.getKnowledgeList(),
				this.getColumnList(),
				this.getLiveList(),
				this.getOfflineList(),
				this.getMaterialList()
			]).then(res => {
				//加载完成
				this.loading = false
			})
		},
		created() {
			
		},
		computed: {
			...mapState(['config'])
		},
		methods: {
			
			/**
			 * 获取课程详情数据
			 */
			getData: function(){

				let that = this
				return new Promise((resolve, reject) => {
					let params = this.urlParams
					let data = {}
						data.action = 'detail'
						data.id = params.id
					//获取数据
					let url = '';
						//#ifdef MP-WEIXIN
						url = 'entry/wxapp/teacher'
						//#endif
						//#ifdef H5
						url = 'entry/site/teacher'
						//#endif
					this.util.request({
						url : url,
						data : data,
						success: function (res) {
							if (res.data.code == 200) {
								that.data = res.data.data
								
							}
							resolve(res.data)
						},
						fail: function(){
						}
					})
				})
				
			},
			
			/**
			 * 进入详细介绍页
			 */
			goToContent: function(id){
				let urlParams = 'id='+id
				let url = 'content?' + urlParams
				console.log(url)
				//指定跳转地址
				uni.navigateTo({
				    url: url
				});
			},
			
			/**
			 * 获取点播课列表
			 */
			getKnowledgeList: function(){
				let that = this
				
				let data = {}
					data.action = 'lists'
					data.m = 'muu_classroom'
					data.page = 1
					data.rows = 4
					data.teacher_id = this.urlParams.id
					
				//获取数据
				let url = '';
					//#ifdef MP-WEIXIN
					url = 'entry/wxapp/knowledge'
					//#endif
					//#ifdef H5
					url = 'entry/site/knowledge'
					//#endif
					
				return new Promise((resolve, reject) => {
					this.util.request({
						url : url,
						data : data,
						success: function (res) {
							if (res.data.code == 200) {
								that.knowledgeListParams.title = '课程'
								that.knowledgeListParams.rows = res.data.data.per_page
								that.knowledgeListParams.category_id = 0
								that.knowledgeListParams.teacher_id = data.teacher_id
								that.knowledgeListParams.list = res.data.data.data
								that.knowledgeListParams.style = 0
								console.log(that.knowledgeListParams)
							}
							resolve(res.data)
						}
					})
				})
			},
			
			/**
			 * 获取专栏列表
			 */
			getColumnList: function(){
				let that = this
				let data = {}
					data.action = 'lists'
					data.m = 'muu_classroom'
					data.page = 1
					data.rows = 4
					data.teacher_id = this.urlParams.id
				//获取数据
				let url = '';
					//#ifdef MP-WEIXIN
					url = 'entry/wxapp/column'
					//#endif
					//#ifdef H5
					url = 'entry/site/column'
					//#endif
					
				return new Promise((resolve, reject) => {
					this.util.request({
						url : url,
						data : data,
						success: function (res) {
							if (res.data.code == 200) {
								that.columnListParams.title = '专栏'
								that.columnListParams.rows = res.data.data.per_page
								that.columnListParams.category_id = 0
								that.columnListParams.teacher_id = data.teacher_id
								that.columnListParams.list = res.data.data.data
								that.columnListParams.style = 0
							}
							resolve(res.data)
						}
					})
				})
			},
			
			/**
			 * 获取直播列表
			 */
			getLiveList: function(){
				let that = this
				let data = {}
					data.action = 'lists'
					
					data.page = 1
					data.rows = 4
					data.teacher_id = this.urlParams.id
				//获取数据
				let url = '';
					//#ifdef MP-WEIXIN
					url = 'entry/wxapp/livecourse'
					data.m = 'muu_classroom'
					//#endif
					//#ifdef H5
					url = 'entry/site/live'
					data.m = 'muu_classroom_plugin_livecourse'
					//#endif
				return new Promise((resolve, reject) => {
					this.util.request({
						url : url,
						data : data,
						success: function (res) {
							if (res.data.code == 200) {
								that.liveListParams.title = '直播'
								that.liveListParams.rows = res.data.data.per_page
								that.liveListParams.category_id = 0
								that.liveListParams.teacher_id = data.teacher_id
								that.liveListParams.list = res.data.data.data
								that.liveListParams.style = 0
							}
							resolve(res.data)
						}
					})
				})
				
			},
			
			/**
			 * 获取线下课列表
			 */
			getOfflineList: function(){
				let that = this
				let data = {}
					data.action = 'lists'
					data.page = 1
					data.rows = 4
					data.teacher_id = this.urlParams.id
				//获取数据
				let url = '';
					//#ifdef MP-WEIXIN
					url = 'entry/wxapp/offline'
					data.m = 'muu_classroom'
					//#endif
					//#ifdef H5
					url = 'entry/site/offline'
					data.m = 'muu_classroom_plugin_offline'
					//#endif
					
				return new Promise((resolve, reject) => {
					this.util.request({
						url : url,
						data : data,
						success: function (res) {
							if (res.data.code == 200) {
								that.offlineListParams.title = '线下课'
								that.offlineListParams.rows = res.data.data.per_page
								that.offlineListParams.category_id = 0
								that.offlineListParams.teacher_id = data.teacher_id
								that.offlineListParams.list = res.data.data.data
								that.offlineListParams.style = 0
							}
							resolve(res.data)
						}
					})
				})	
				
			},
			
			/**
			 * 获取资料下载列表
			 */
			getMaterialList: function(){
				let that = this
				let data = {}
					data.action = 'lists'
					data.page = 1
					data.rows = 4
					data.teacher_id = this.urlParams.id
				//获取首页数据
				let url = '';
					//#ifdef MP-WEIXIN
					url = 'entry/wxapp/material'
					data.m = 'muu_classroom'
					//#endif
					//#ifdef H5
					url = 'entry/site/material'
					data.m = 'muu_classroom_plugin_material'
					//#endif
				return new Promise((resolve, reject) => {
					this.util.request({
						url : url,
						data : data,
						success: function (res) {
							if (res.data.code == 200) {
								that.materialListParams.title = '资料'
								that.materialListParams.rows = res.data.data.per_page
								that.materialListParams.category_id = 0
								that.materialListParams.teacher_id = data.teacher_id
								that.materialListParams.list = res.data.data.data
								that.materialListParams.style = 0
							}
							resolve(res.data)
						}
					})
				})
				
			},

		},
		onReachBottom() {
			console.log('页面滚动到底部')
		},
	}
</script>

<style lang="scss">
	page {
		background-color: #f8f8f8;
	}
	
	.base-info {
		display: flex;
		background-color: #fff;
		padding: 20rpx;
		margin-bottom: 20rpx;
		.cover {
			position: relative;
			width: 160rpx;
			image {
				width: 100%;
				display: block;
			}
		}
		.info {
			flex: 1;
			position: relative;
			padding: 0 20rpx;
			.title {
				font-size: 36rpx;
				font-weight: 600;
				color: #000;
				line-height: 64rpx;
			}
			.description {
				font-size: 28rpx;
				color: #999;
			}
		}
	}

	

	

</style>
